function Engine(/*vec2*/ viewport, /*div*/ container){
	this.canvas = this.createCanvas(viewport, container);
	this.ctx = this.getContext(this.canvas);
	
	this.images = [];
}

Engine.prototype.createCanvas = function(/*vec2*/ viewport, /*div*/ container){
	var canvas = document.createElement("canvas");
	canvas.width = viewport.a;
	canvas.height = viewport.b;
	canvas.innerHTML = "Your browser can't display HTML5 games";
	
	container.appendChild(canvas);
	
	return canvas;
};

Engine.prototype.getContext = function(/*canvas*/ canvas){
	var ctx = canvas.getContext("2d");
	ctx.width = canvas.width;
	ctx.height = canvas.height;
	
	ctx.clear = function(){
		ctx.fillStyle = "black";
		ctx.fillRect(0,0,ctx.width,ctx.height);
	};
	
	return ctx;
};

Engine.prototype.loadImage = function(/*String*/ filename, /*vec2*/ imageNum){
	var img = new Image();
	img.src = filename;
	img.g_imageNum = imageNum;
	img.g_ready = false;
	img.g_id = this.images.length;
	
	Utils.addEvent(img, "load", function(){
		img.g_ready = true;
		img.g_imgSize = vec2(img.width / img.g_imageNum.a, img.height / img.g_imageNum.b);
	});
	
	this.images.push(img);
	return img;
};

Engine.prototype.areImagesReady = function(){
	for (var i=0,len=this.images.length;i<len;i++){
		if (!this.images[i].g_ready)
			return false;
	}
	
	return true;
};

Engine.prototype.getImagesPercent = function(){
	if (this.images.length == 0) return 1;
	var percent = 0;
	
	for (var i=0,len=this.images.length;i<len;i++){
		if (this.images[i].g_ready)
			percent += 1;
	}
	
	return percent / this.images.length;
};
